<!-- 选择政策 -->
<template>
	<view>
		<uv-popup ref="popupRef" mode="bottom" round="32rpx" closeable>
			<view class="policy-pop" :style="{paddingBottom:paddingBottom + 'px'}">
				<scroll-view class="policy-scroll" scroll-y="true" >
					<view class="policy-item" v-for="item in dataList" :key="item.policyId" @tap="didSelectItem(item)">
						<image class="policy-item-icon" src="/static/operate/policy_icon.png" mode="aspectFit"></image>
						<view class="policy-item-content" v-if="item.policyId == 0">
							<text>{{item.policyName}}</text>
						</view>
						<view class="policy-item-content" v-else>
							<text>{{item.policyId}}</text>
							<text>{{item.policyName}}</text>
						</view>
						<view class="policy-item-right">
							<xh-icon icon="icon_jiantou"></xh-icon>
						</view>
					</view>
				</scroll-view>
			</view>
		</uv-popup>
	</view>
</template>

<script setup>
	import { ref,onMounted} from 'vue'
	const emits = defineEmits(['select'])
	const popupRef = ref(null)
	const paddingBottom = ref(0)
	const dataList = ref([])
	const show = (data)=>{
		dataList.value = data
		popupRef.value.open()
	}
	//选择政策
	const didSelectItem = (item)=>{
		emits('select',item)
		popupRef.value.close()
	}
	defineExpose({
		show
	})
	
	onMounted(()=>{
		// #ifdef H5
		const pages = getCurrentPages();  // 获取所有页面栈的实例数组
		const currentPage = pages[pages.length - 1];
		if(currentPage.route == 'pages/operate/operate'){
			paddingBottom.value = 50
		}
		else{
			paddingBottom.value = 0
		}
		// #endif
	})
	
</script>

<style lang="scss" scoped>
	.policy-pop{
		.policy-scroll {
			height: 600rpx;
			width: 100%;
			margin-top: 100rpx;
			.policy-item{
				display: flex;
				align-items: center;
				padding: 20rpx;
				position: relative;
				border: 1px solid $xh-line-color;
				border-radius: 16rpx;
				margin: 0 30rpx 20rpx;
				.policy-item-icon{
					width: 54rpx;
					height: 54rpx;
				}
				.policy-item-right{
					margin-left: auto;
				}
				.policy-item-content{
					display: flex;
					flex-direction: column;
					margin-left: 20rpx;
					text:nth-child(2){
						margin-top: 10rpx;
					}
				}
			}
		}
	}
	
</style>